<template>
	<div class="info">
		<h2 :class="$attrs.class">姓名:{{ name }}</h2>
		<h2>年龄:{{ age }}</h2>
		<h2>身高:{{ height }}</h2>
		<h2>朋友:{{ friend.name }}</h2>
	</div>

	<!-- <div class="other"></div> -->
	<div class="other" v-bind="$attrs"></div>
</template>

<script>
export default {
	// 数组
	// props: ['age', 'name', 'height'],

	/* props: {
		name: String,
		age: Number,
		height: Number,
	}, */
	// inheritAttrs: false,
	props: {
		name: {
			type: String,
			default: '我是默认name',
		},
		age: {
			type: Number,
			default: 0,
		},
		height: {
			type: Number,
			required: true,
			default: 1.8,
		},
		// 重要原则: 对象类型写默认值时, 需要编写default的函数, 函数返回默认值
		friend: {
			type: Object,
			default: () => ({
				name: 'james',
			}),
		},
		hobbies: {
			type: Array,
			default: () => ['a', 'b', 'c'],
		},
		showMessage: {
			type: String,
			default: '哈哈',
		},
	},
}
</script>

<style scoped></style>
